<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>tab标签</title>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <meta http-equiv="X-UA-Compatible" content="IE=8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0,user-scalable=no" />

    <link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="tab.css?r=222" rel="stylesheet" />
</head>
<body>

<!-- activities -->
<div class="activities" id="activities">
    <div class="container">
        <h1 class="text-center"><strong>活动内容</strong></h1>
        <div class="row">
               
                    <input id="tab-cooperate" type="radio" name="tabs" >
                    <label id="cooperate-label" class="col-xs-4 text-center" for="tab-cooperate">合作探讨</label>

                    <input id="tab-product" type="radio" name="tabs">
                    <label id="product-label" class="col-xs-4 text-center" for="tab-product">新品发布</label> 

                    <input id="tab-industry" type="radio" name="tabs">
                    <label id="industry-label" class="col-xs-4 text-center" for="tab-industry">行业分享</label> 

                    <section id="cooperate">
                        <br>
                        <div class="col-sm-4 col-xs-12">
                            <a href="http://www.kedacom.com/lastaction/4514.jhtml" target="_blank"><img src="images/cooperate.jpg" alt="" class="img-responsive"></a>
                        </div>
                        <div class="col-sm-8 col-xs-12 cooperate-text text-left">
                            <p>千年沉淀，孕育苏州和合文化。和合存异，方为共生之道。科达以“尚和合 谋共生” 为渠道合作理念，以客户业务为驱动，致力于打造可持续的价值合作生态</p>
                        </div>
                    </section>

                    <section id="product">
                        <div class="row product-item">
                            <div class="col-sm-3 col-xs-6 product-img">
                                <img src="images/perception.jpg" alt="" class="img-responsive">
                            </div>
                            <div class="col-sm-3 col-xs-6 product-midlink hidden-lg hidden-md hidden-sm">
                                <a href="http://www.kedacom.com/rykksxj/4452.jhtml" target="_blank">人员卡口摄像机</a>
                                <a href="http://www.kedacom.com/tzfxsxj/4454.jhtml" target="_blank">结构化分析摄像机</a>
                            </div>
                            <div class="col-sm-6 col-xs-12 product-text">
                                <h3>感知智能应用</h3>
                                <p>基于前端感知与后端大数据平台的结合，总结实战应用经验，科达推出猎鹰系列感知型摄像机及智能分析系统，聚焦视频大数据的实战应用。</p>
                            </div>
                            <div class="col-sm-3 col-xs-12 product-alink hidden-xs">
                                <a href="http://www.kedacom.com/rykksxj/4452.jhtml" target="_blank">人员卡口摄像机</a>
                                <a href="http://www.kedacom.com/tzfxsxj/4454.jhtml" target="_blank">结构化分析摄像机</a>
                            </div>
                        </div>
                        <div class="row product-item">
                            <div class="col-sm-3 col-xs-6 product-img">
                                <img src="images/monitor.jpg" alt="" class="img-responsive">
                            </div>
                            <div class="col-sm-3 col-xs-6 product-midlink hidden-lg hidden-md hidden-sm">
                                <a href="http://www.kedacom.com/slpwnvrhy/894.jhtml" target="_blank">感知NVR</a>
                                <a href="http://www.kedacom.com/ytwlsxjhy/4429.jhtml" target="_blank">高空瞭望</a>
                                <a href="http://www.kedacom.com/qxwlsxjhy/874.jhtml" target="_blank">星光级摄像机</a>
                                <a href="http://www.kedacom.com/cpzl/4465.jhtml" target="_blank">24盘位高密度磁阵</a>
                            </div>
                            <div class="col-sm-6 col-xs-12 product-text">
                                <h3>监控新品</h3>
                                <p>在视频监控领域，科达平均每五天推出一款新品。2017年巡展之际，科达将发布感知NVR、无人机、45倍球机、24盘位高密度磁阵等一系列监控新品。</p>
                            </div>
                            <div class="col-sm-3 col-xs-12 product-alink hidden-xs">
                                <a href="http://www.kedacom.com/slpwnvrhy/894.jhtml" target="_blank">感知NVR</a>
                                <a href="http://www.kedacom.com/ytwlsxjhy/4429.jhtml" target="_blank">高空瞭望</a>
                                <a href="http://www.kedacom.com/qxwlsxjhy/874.jhtml" target="_blank">星光级摄像机</a>
                                <a href="http://www.kedacom.com/cpzl/4465.jhtml" target="_blank">24盘位高密度磁阵</a>
                            </div>
                        </div>
                        <div class="row product-item">
                            <div class="col-sm-3 col-xs-6 product-img">
                                <img src="images/removal.jpg" alt="" class="img-responsive">
                            </div>
                            <div class="col-sm-3 col-xs-6 product-midlink hidden-lg hidden-md hidden-sm">
                                <a href="http://www.kedacom.com/danjin/4288.jhtml" target="_blank">执法记录仪</a>
                                <a href="http://www.kedacom.com/danjin/4287.jhtml" target="_blank">执法采集站</a>
                                <a href="http://www.kedacom.com/ydjw/4354.jhtml" target="_blank">移动警务</a>
                                <a href="http://www.kedacom.com/bianxie/4533.jhtml" target="_blank">4G布控球</a>
                            </div>
                            <div class="col-sm-6 col-xs-12 product-text">
                                <h3>4G移动</h3>
                                <p>秉持“应用为王”的产品理念，科达依托视信通、智查通两大平台，研发了移动警务P1S、执法记录仪等多款4G移动终端，致力于推广公安警务的移动化普及。</p>
                            </div>
                            <div class="col-sm-3 col-xs-12 product-alink hidden-xs">
                                <a href="http://www.kedacom.com/danjin/4288.jhtml" target="_blank">执法记录仪</a>
                                <a href="http://www.kedacom.com/danjin/4287.jhtml" target="_blank">执法采集站</a>
                                <a href="http://www.kedacom.com/ydjw/4354.jhtml" target="_blank">移动警务</a>
                                <a href="http://www.kedacom.com/bianxie/4533.jhtml" target="_blank">4G布控球</a>
                            </div>
                        </div>
                        <div class="row product-item">
                            <div class="col-sm-3 col-xs-6 product-img">
                                <img src="images/conference.jpg" alt="" class="img-responsive">
                            </div>
                            <div class="col-sm-3 col-xs-6 product-midlink hidden-lg hidden-md hidden-sm">
                                <a href="http://www.kedacom.com/sxypt/index.jhtml" target="_blank">云视讯平台</a>
                                <a href="http://www.kedacom.com/yjzd/index.jhtml" target="_blank">云视讯终端</a>
                                <a href="http://www.kedacom.com/wc/index.jhtml" target="_blank">网呈</a>
                                <a href="http://www.kedacom.com/wssxj/index.jhtml" target="_blank">会议摄像机</a>
                                <a href="http://www.kedacom.com/wsmkf/index.jhtml" target="_blank">数字麦克风</a>
                            </div>
                            <div class="col-sm-6 col-xs-12 product-text">
                                    <h3>云视讯会议</h3>
                                    <p>科达5.0云视频会议突破传统视频，通过五层云视频架构，带来全新的视频沟通体验，“654321”全线产品依托5.0云视频架构正式发布，使云视频架构理念落地到云视频产品。</p>
                            </div>
                            <div class="col-sm-3 col-xs-12 product-alink hidden-xs">
                                <a href="http://www.kedacom.com/sxypt/index.jhtml" target="_blank">云视讯平台</a>
                                <a href="http://www.kedacom.com/yjzd/index.jhtml" target="_blank">云视讯终端</a>
                                <a href="http://www.kedacom.com/wc/index.jhtml" target="_blank">网呈</a>
                                <a href="http://www.kedacom.com/wssxj/index.jhtml" target="_blank">会议摄像机</a>
                                <a href="http://www.kedacom.com/wsmkf/index.jhtml" target="_blank">数字麦克风</a>
                            </div>
                        </div>
                        <div class="row product-item">
                            <div class="col-sm-3 col-xs-6 product-img">
                                <img src="images/audio.jpg" alt="" class="img-responsive">
                            </div>
                            <div class="col-sm-3 col-xs-6 product-midlink hidden-lg hidden-md hidden-sm">
                                <a href="http://www.kedacom.com/pjp/4521.jhtml" target="_blank">晶艳二代</a>
                                <a href="http://www.kedacom.com/xkpt/index.jhtml" target="_blank">显控平台</a>
                            </div>
                            <div class="col-sm-6 col-xs-12 product-text">
                                <h3>音视频</h3>
                                    <p>通过新一代小间距LED拼接屏、显控平台和指挥调度的组合应用，让客户业务中产生的音视频、数据，最终会汇聚到显控系统中，以可视化的方式呈现，补齐了科达端到端定位的最后一块拼图，给用户带来焕然一新的视觉效果和操控体验。</p>
                            </div>
                            <div class="col-sm-3 col-xs-12 product-alink hidden-xs">
                                <a href="http://www.kedacom.com/pjp/4521.jhtml" target="_blank">晶艳二代</a>
                                <a href="http://www.kedacom.com/xkpt/index.jhtml " target="_blank">显控平台</a>
                            </div>
                        </div>
                    </section>

                    <section id="industry">
                        <div class="col-sm-4 col-xs-6 ">
                            <a href="http://www.kedacom.com/gongan/index.jhtml" target="_blank" class="img1">
                                <img src="images/police.png" alt="公安" class="img-responsive">
                                <h5 class="text-center">公安</h5>
                            </a> 
                        </div>
                        <div class="col-sm-4 col-xs-6 ">
                            <a href="http://www.kedacom.com/jianchayuan/index.jhtml" target="_blank" class="img2">
                                <img src="images/procuratorate.png" alt="检察院" class="img-responsive">
                                <h5 class="text-center">检察院</h5>
                            </a>
                        </div>
                        <div class="col-sm-4 col-xs-6 ">
                            <a href="http://www.kedacom.com/fayuan/index.jhtml"  target="_blank" class="img3">
                                <img src="images/justice.png" alt="法院" class="img-responsive">
                                <h5 class="text-center">法院</h5>
                            </a>
                        </div>
                        <div class="col-sm-4 col-xs-6 ">
                            <a href="http://www.kedacom.com/sifa/index.jhtml" target="_blank" class="img4">
                                <img src="images/administration.png" alt="司法" class="img-responsive">
                                <h5 class="text-center">司法</h5>
                            </a>
                        </div>
                        <div class="col-sm-4 col-xs-6 ">
                            <a href="http://www.kedacom.com/jiaotong/index.jhtml" target="_blank" class="img5">
                                <img src="images/traffic.png" alt="智能交通" class="img-responsive">
                                <h5 class="text-center">智能交通</h5>
                            </a>
                        </div>
                        <div class="col-sm-4 col-xs-6 ">
                            <a href="http://www.kedacom.com/jiaoyu/index.jhtml" target="_blank" class="img6">
                                <img src="images/education.png" alt="教育" class="img-responsive">
                                <h5 class="text-center">教育</h5>
                            </a>
                        </div>
                    </section>
        </div>
    </div>
</div>
<!-- activities end-->

</body>
 <!-- jQuery (Bootstrap 的 JavaScript 插件需要引入 jQuery) -->
 <script src="https://code.jquery.com/jquery.js"></script>

<script type="text/javascript">
$(function(){  
// debugger;
$("#cooperate-label").addClass("activities-label");
$("#product-label").removeClass("activities-label");
$("#industry-label").removeClass("activities-label");

$(".activities1,#cooperate-label").on("click",function(){
    $("input[name='tabs']").each(function(){  
        if($(this).is(":checked")){
          $(this).removeAttr("checked");
        }
    }); 
    $("#cooperate-label").addClass("activities-label");
    $("#cooperate").css('display','block');
    $("#product-label").removeClass("activities-label");
    $("#product").css('display','none');
    $("#industry-label").removeClass("activities-label");
    $("#industry").css('display','none');
    $("#tab-cooperate").attr('checked',"checked"); 
    var height = $("#activities").offset().top-50;
    $(window).scrollTop(height);
});
$(".activities2,#product-label").on("click",function(){
  $("input[name='tabs']").each(function(){  
          if($(this).is(":checked")){
            $(this).removeAttr("checked");
          }
      }); 
      $("#product-label").addClass("activities-label");
      $("#product").css('display','block');
      $("#cooperate-label").removeClass("activities-label");
      $("#cooperate").css('display','none');
      $("#industry-label").removeClass("activities-label");
      $("#industry").css('display','none');
      $("#tab-product").attr('checked',"checked");

      var height = $("#activities").offset().top-50;
      $(window).scrollTop(height);
});
$(".activities3,#industry-label").on("click",function(){
    $("input[name='tabs']").each(function(){  
            if($(this).is(":checked")){
              $(this).removeAttr("checked");
            }
        });
        $("#industry-label").addClass("activities-label");
        $("#industry").css('display','block');
        $("#cooperate-label").removeClass("activities-label");
        $("#cooperate").css('display','none');
        $("#product-label").removeClass("activities-label");
        $("#product").css('display','none'); 
        $("#tab-industry").attr('checked',"checked");
        var height = $("#activities").offset().top-50;
        $(window).scrollTop(height);
});


});






</script>
</html>
